Recibí un error cuando quiero configurar si en el código de gancho personalizado
if (dataValid) { const contactForm = useDataForm(onSubmit, modelToForm(dataValid)); }Después de esto, recibí un error ->
React Hook "useDataForm" is called conditionally. React Hooks must be called in the exact same order in every component renderEl problema es si la declaración cuando llama a este trabajo bueno (sin si) ->
const contactForm = useDataForm(onSubmit, modelToForm(dataValid));No quiero cargar useDataForm (gancho personalizado) si dataValid no es válido y está lleno.
No podemos llamar a Hooks dentro de condicionales, bucles o funciones anidadas para garantizar que los Hooks se llamen en el mismo orden cada vez que se represente un componente. El orden es importante para la forma en que React asocia las llamadas Hook con los componentes.
Puede consultar este recurso, tal vez pueda ser útil.
Según la documentación de React, no puede llamar a ganchos condicionalmente .
Aquí se explica en profundidad por qué.
Cuando surge la necesidad de llamar a un gancho condicionalmente, puede optar por dos soluciones:
useDataForm y luego usa contactForm solo si dataValid es true const contactForm = useDataForm(onSubmit, modelToForm(dataValid)); if (dataValid) { // do what you need to do with dataValid } // or return <Child data={dataValid ? contactForm : otherData} />dataValid es verdadero const contactForm = useDataForm(onSubmit, dataValid ? modelToForm(dataValid) : fallbackArg);